<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>CodePen - CSS Masonry (CSS Column)</title>
  <link rel="stylesheet" href="./style.css">

</head>
<body>
<!-- partial:index.partial.html -->
<div class="masonry">
  <div class="item">
    <img src="https://picsum.photos/360/460?random=1">
  </div>
    <div class="item">
    <img src="https://picsum.photos/360/520?random=2">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/420?random=3">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/420?random=4">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/480?random=5">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/500?random=6">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/500?random=7">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/400?random=8">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/440?random=9">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/420?random=10">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/500?random=11">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/460?random=12">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/480?random=13">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/440?random=14">
  </div>
  <div class="item">
    <img src="https://picsum.photos/360/420?random=15">
  </div>
</div>
<!-- partial -->
  
</body>
</html>
